import 'package:flutter/material.dart';
import 'widgets/custom_lottie_widget.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Lottie动画示例',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Lottie动画示例'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage>
    with SingleTickerProviderStateMixin {
  // 定义动画控制器（用于外部控制演示）
  late AnimationController _controller;

  // 动画播放状态
  bool _isPlaying = true;

  // 已播放次数
  int _playedTimes = 0;

  // 循环播放开关
  bool _repeat = true;

  // 循环次数
  int? _repeatCount = 3;

  // 动画速度
  double _speed = 1.0;

  @override
  void initState() {
    super.initState();
    _controller = AnimationController(
      vsync: this,
      duration: const Duration(seconds: 2),
    );
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: SingleChildScrollView(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            // 标题
            const Text(
              '自动播放示例',
              style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 16),

            // 基础示例 - 自动循环播放
            Center(
              child: Container(
                decoration: BoxDecoration(
                  border: Border.all(color: Colors.grey),
                  borderRadius: BorderRadius.circular(8),
                ),
                child: CustomLottieWidget(
                  animationPath: 'lotties/coin_littlez_eyes.json',
                  width: 200,
                  height: 200,
                  repeat: _repeat,
                  repeatCount: _repeatCount,
                  speed: _speed,
                  onComplete: () {
                    setState(() {
                      _playedTimes++;
                    });
                    ScaffoldMessenger.of(context).showSnackBar(
                      SnackBar(content: Text('动画播放完成！已播放 $_playedTimes 次')),
                    );
                  },
                  key: ValueKey('${_repeat}_${_repeatCount}_${_speed}'),
                ),
              ),
            ),

            const SizedBox(height: 24),

            // 控制面板
            Card(
              child: Padding(
                padding: const EdgeInsets.all(16.0),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    const Text(
                      '动画控制面板',
                      style:
                          TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
                    ),
                    const SizedBox(height: 16),

                    // 循环播放开关
                    Row(
                      children: [
                        const Text('循环播放:'),
                        Switch(
                          value: _repeat,
                          onChanged: (value) {
                            setState(() {
                              _repeat = value;
                              _playedTimes = 0;
                            });
                          },
                        ),
                      ],
                    ),

                    // 循环次数设置
                    Visibility(
                      visible: _repeat,
                      child: Row(
                        children: [
                          const Text('循环次数:'),
                          const SizedBox(width: 8),
                          DropdownButton<int?>(
                            value: _repeatCount,
                            items: [
                              const DropdownMenuItem(
                                value: null,
                                child: Text('无限循环'),
                              ),
                              ...List.generate(5, (index) => index + 1)
                                  .map((count) => DropdownMenuItem(
                                        value: count,
                                        child: Text('$count'),
                                      ))
                                  .toList(),
                            ],
                            onChanged: (value) {
                              setState(() {
                                _repeatCount = value;
                                _playedTimes = 0;
                              });
                            },
                          ),
                        ],
                      ),
                    ),

                    // 速度控制滑块
                    Row(
                      children: [
                        const Text('速度:'),
                        Expanded(
                          child: Slider(
                            value: _speed,
                            min: 0.5,
                            max: 3.0,
                            divisions: 5,
                            label: _speed.toStringAsFixed(1),
                            onChanged: (value) {
                              setState(() {
                                _speed = value;
                              });
                            },
                          ),
                        ),
                        Text(_speed.toStringAsFixed(1) + 'x'),
                      ],
                    ),
                  ],
                ),
              ),
            ),

            const SizedBox(height: 24),

            // 手动控制示例标题
            const Text(
              '手动控制示例',
              style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 16),

            // 手动控制示例
            Center(
              child: Column(
                children: [
                  Container(
                    decoration: BoxDecoration(
                      border: Border.all(color: Colors.grey),
                      borderRadius: BorderRadius.circular(8),
                    ),
                    child: CustomLottieWidget(
                      animationPath: 'lotties/coin_littlez_eyes.json',
                      width: 200,
                      height: 200,
                      controller: _controller,
                      autoPlay: false,
                    ),
                  ),
                  const SizedBox(height: 16),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      ElevatedButton(
                        onPressed: () {
                          if (_isPlaying) {
                            _controller.stop();
                          } else {
                            _controller.forward();
                          }
                          setState(() {
                            _isPlaying = !_isPlaying;
                          });
                        },
                        child: Text(_isPlaying ? '暂停' : '播放'),
                      ),
                      const SizedBox(width: 16),
                      ElevatedButton(
                        onPressed: () {
                          _controller.reset();
                          setState(() {
                            _isPlaying = false;
                          });
                        },
                        child: const Text('重置'),
                      ),
                    ],
                  ),
                ],
              ),
            ),

            const SizedBox(height: 24),

            // 播放统计
            Text(
              '已播放完成次数：$_playedTimes',
              style: const TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
            ),
          ],
        ),
      ),
    );
  }
}
